<template>
  <form-item :form-datas = "formDatas" :form-item = "field" :parent-comp-type = "parentCompType"
  >
    <el-time-picker
        :arrow-control = "field.preps['arrowControl']"
        :clear-icon = "field.preps['clearIcon']"
        :clearable = "field.preps['clearable']"
        :default-value = "field.preps['defaultValue']"
        :disabled = "field.preps['disabled']"
        :disabled-hours = "field.preps['disabledHours']"
        :disabled-minutes = "field.preps['disabledMinutes']"
        :disabled-seconds = "field.preps['disabledSeconds']"
        :editable = "field.preps['editable']"
        :end-placeholder = "field.preps['endPlaceholder']"
        :format = "field.preps['format']"
        :id = "field.preps['id']"
        :is-range = "field.preps['isRange']"
        :name = "field.preps['name']"
        :placeholder = "field.preps['placeholder']"
        :popper-class = "field.preps['popperClass']"
        :prefix-icon = "field.preps['prefixIcon']"
        :range-separator = "field.preps['rangeSeparator']"
        :readonly = "field.preps['readonly']"
        :size = "field.preps['size']"
        :start-placeholder = "field.preps['startPlaceholder']"
        :teleported = "field.preps['teleported']"
        v-model = "starHorseDynamicForm[field.preps['name']]"
    />

  </form-item>
</template>

<script>
import FormItem from "./form-item";

export default {
  name: "time-item",
  components: {FormItem},
  props: {
    parentCompType: {type: Object},
    starHorseDynamicForm: {type: Object},
    field: {
      type: Object
    },
    formDatas: {type: Object}
  },
  data() {
    let formItem = {label: "input", required: false};
    return {
      formItem,
      dataField: ""
    }
  },
  methods: {
    selectItem(data) {
      let _this = this;
      _this.$emit("selectItem", data, _this.parentCompType);
    }
  }
}
</script>

<style scoped>

</style>